<template>
    <div>
        <h3>房型添加</h3>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">类型名称</td>
                    <td><input type="text" v-model="Info.HouseTypeName"></td>
                </tr>
                <tr>
                    <td align="right">房型图片</td>
                    <td><input type="file" @change="img">
                    <img :src="Info.HousePhoto" alt="" width="100" height="90" v-if="Info.HousePhoto!=''">
                    </td>
                </tr>
                <tr>
                    <td align="right">房型价格</td>
                    <td><input type="text" v-model="Info.HousePrice"></td>
                </tr>
                <tr>
                    <td align="right">房型面积</td>
                    <td><input type="text" v-model="Info.HouseArea"></td>
                </tr>
                <tr>
                    <td align="right">是否有窗</td>
                    <td><input type="radio" name="win" :value="1" v-model="Info.InWin">有窗
                        <input type="radio" name="win" :value="0" v-model="Info.InWin">无窗
                    </td>
                </tr>
                <tr>
                    <td align="right">是否有早饭</td>
                    <td><input type="radio" name="fan" :value="1" v-model="Info.IsBreakfast">含早餐
                        <input type="radio" name="fan" :value="0" v-model="Info.IsBreakfast">不含早餐</td>
                </tr>
                <tr>
                    <td align="right">载客量</td>
                    <td><input type="text" v-model="Info.PeopleNum"></td>
                </tr>
                <tr>
                    <td align="right">状态</td>
                    <td><input type="radio" name="state" :value="1" v-model="Info.State">启用
                        <input type="radio" name="state" :value="0" v-model="Info.State">禁用</td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="添加" class="btn btn-primary" @click="add">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue';
import axios from 'axios';
import moment from 'moment';
import { useRoute, useRouter } from 'vue-router';
import { idText } from 'typescript';
import router from '@/router';
const Route = useRoute();
const Router = useRouter();

let Info:any=reactive({
  "HouseTypeName": "",
  "HousePhoto": "",
  "HousePrice": '',
  "HouseArea": '',
  "InWin": 1,
  "IsBreakfast": 1,
  "PeopleNum": '',
  "State": 1,
})
const add=()=>{
    if(Info.HouseTypeName=="")
    {
        alert("房型名称不能为空");
        return;
    }
    axios({
        url:'/api/House/HouseTypeAdd',
        method:'post',
        data:Info
    })
    .then((res)=>{
        console.log(res);
        if(res.data==-1)
        {
            alert("方形已存在");
            return;
        }
        else if(res.data>0)
        {
            alert("添加成功");
            Router.push('/housetypelist');
        }
        else{
            alert("添加失败");
            return;
        }
    })
}
const img=(e:any)=>{
    let f=e.target.files[0];
    let fs=new FormData();
    fs.append('file',f);
    axios({
        url:'/api/Img/Img',
        method:'post',
        data:fs
    })
    .then((res)=>{
        console.log(res);
        if(res.data=="图片格式不正确")
        {
            alert("图片格式不正确");
            return;
        }
        if(res.data=="图片大小不得大于2M")
        {
            alert("图片大小不得大于2M");
            return;
        }
        Info.HousePhoto=res.data;
    })
}
</script>

<style scoped>

</style>